<template>
  <div class="app-container">
    <upload-excel-component
      :on-success="handleSuccess"
      :before-upload="beforeUpload"
    />
    <el-table
      :data="tableData"
      border
      highlight-current-row
      style="width: 100%; margin-top: 20px"
    >
      <el-table-column
        v-for="item of tableHeader"
        :key="item"
        :prop="item"
        :label="item"
      />
    </el-table>
  </div>
</template>

<script>
import UploadExcelComponent from "@/components/UploadExcel/index.vue";
import { formatExcelDate } from "@/utils/index";
import { importEmployee } from "@/api/employees";
export default {
  name: "UploadExcel",
  components: { UploadExcelComponent },
  data() {
    return {
      tableData: [],
      tableHeader: [],
    };
  },
  methods: {
    beforeUpload(file) {
      const isLt1M = file.size / 1024 / 1024 < 1;

      if (isLt1M) {
        return true;
      }

      this.$message({
        message: "Please do not upload files larger than 1m in size.",
        type: "warning",
      });
      return false;
    },
    handleSuccess({ results, header }) {
      console.log('transExcel',this.transExcel(results));
      this.tableHeader = header;
      this.tableData =results
      const data = this.transExcel(results);
      this.doAdd(data);
    },
        // 批量导入
    async doAdd(data) {
      try {
        const res = await importEmployee(data);
        console.log("importEmployee", res);
        this.$message.success(res.message);
        // 返回上一级
        this.$router.back();
        // 保存数据
      } catch (err) {
        console.log("importEmployee", err);
      }
    },
    // excel 英转中
    transExcel(results) {
      const mapInfo = {
        入职日期: "timeOfEntry",
        手机号: "mobile",
        姓名: "username",
        转正日期: "correctionTime",
        工号: "workNumber",
        部门: "departmentName",
        聘用形式: "formOfEmployment",
      };
      return results.map((zhObj) => {
        const enObj = {};
        const zhKeys = Object.keys(zhObj); // ['姓名', '手机号']

        zhKeys.forEach((zhKey) => {
          const enKey = mapInfo[zhKey];
          if (enKey === "timeOfEntry" || enKey === "correctionTime") {
            enObj[enKey] = new Date(formatExcelDate(zhObj[zhKey]));
          } else {
            enObj[enKey] = zhObj[zhKey];
          }
        });
        console.log("enObj", enObj);
        return enObj;
      });
    },
  },
};
</script>
